<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>推理结果</title>
	<link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />

	<style>
	/* 头部样式 */
	.topbar {background: #FF8400; height:50px; border-bottom: 1px solid #DDDFE3;}
	.topbar_title {display: inline-block;font-size: 20px; line-height: 50px;padding-left: 12px;}
	.hr01, .hr02 {height: 28px;}
	.headerico {padding: 11px 15px 11px 15px;}
	.headericohover {background: #DADDE0;}
	.fr{float: right;}
	.fl{float: left;}

	/*第一头部*/
	#logo {padding: 11px 0 0 10px;height: 28px;}
	#citylist {height: 50px; line-height: 50px;padding-left: 15px; font-size: 18px; color: #fff;}
	.citylistarrow {vertical-align: top; width: 20px; padding-top: 15px;}
 .search {height: 34px;line-height: 34px; padding-left: 10px; border-radius: 30px;  margin-top: 8px; position: absolute; left: 20px; right: 60px;font-size: 14px;}
 .search img:first-child {vertical-align: top; width: 20px; padding-top: 7px;padding-right: 10px;}
 .search img:last-child {vertical-align: top; width: 20px; padding-top: 7px;}
 .firstSearch {left: 90px;right: 60px;background-color: #FA6604;color: #FDC29B;}

	/* 第二头部 */
	#topbar_refresh {width: 40px;padding:5px 10px;}
	.whitebar {background-color: #fcfcfc;}
	#whitecity {height: 50px; line-height: 50px;padding-left: 15px; font-size: 18px;color: #FF8400;}
 .secCitylistarrow {vertical-align: top; width: 15px; padding-top: 18px;padding-left: 5px;}
 .secSearch {left: 90px;right: 15px;background-color: #E8E8E8;color: #999;}

 /* 第三头部 */
 .swipepic {padding: 5px 15px 2px 15px;height: 23px;}
 .swipe div {font-size: 4px; text-align: center;color: #999;}
 .thrSearch {left: 50px;right: 60px;background-color: #E8E8E8;color: #999;}

	/* 头部切换样式 */
	.activebar {display: block;}

	/* 底部切换按钮样式 */
	ul {display: -webkit-box; display: -webkit-flex; display: flex; }
	#footer {height: 61px; line-height: 60px; background-color: #FAFAFA;border-top: 1px solid #FAFAFA; }
	#footer li{-webkit-box-flex: 1; -webkit-flex: 1; flex:1; height: 60px;}

	/* 选项卡样式 */
	.scrollbar {display: -webkit-box;display: -webkit-flex; text-align: center; height: 40px; line-height: 40px;background: #EBECF0;font-size: 12px;position: relative;}
	.col1 {-webkit-box-flex:1;-webkit-flex: 1;flex:1;color: #909090;}
	.indexbar {position: absolute;/*background: #0fc;*/width: 50%;height: 5px;left: 0px;bottom: 0px;-webkit-transition: 300ms;}
	.redbox {background: #DB4646;width: 40px;height: 5px;position: relative;left: auto;right: auto; margin-left: auto; margin-right: auto;}


	/* 本地刷新图标 */
	#localrefresh {display:none;float: right; width: 40px; padding: 5px 10px;}
	#field1::-webkit-input-placeholder { color:#666; }
	#field1 {height: 30px; line-height: 30px; width: 70%;}

	.swipe {line-height: 50px;margin-right: 10px;color: #FF8400;}
	.back {float: left; }
	.back img {height: 30px; margin-top: 10px; margin-left: 10px; margin-bottom: 6px; margin-right: 30px;}
	.topbar .title {line-height: 50px;font-size: 22px;position: absolute;left: 50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);}


	/*查询结果list*/
	html,body{
		-webkit-touch-callout:none;
		-webkit-text-size-adjust:none;
		-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
		-webkit-user-select:none;
	}
        *{
            margin: 0;
            padding: 0;
        }
        .innerBox {
            display: block;
            width: 100%;
        }
        .innerBox li {
            width: 100%;
            height: auto;
            background: #FFFFFF;
            display: -webkit-box;
            -webkit-box-align: center;
            font-size: 15px;
						padding: 10px 20px;
            border-bottom: 1px  solid #CDCCD1;
        }

        .smallFont{
            font-size: 13px;
            max-width: 22em;
            color: #bebebe;
        }
        .flex1{
            -webkit-box-flex:1;
        }

			.distance {-webkit-box-flex: 1; box-flex: 1; -ms-box-flex: 1; -ms-flex: 1; text-align: right; line-height: 10px; margin-top: 5px; color: #999; float: right;font-size: 12px;}



	.h20 {margin-top: 5px;height: 20px;background-color: #F5F5F5;}

	</style>
</head>
<body>
	<div id="wrap">
		<!-- 第三头部 -->
		<div id="thridHeader" class="titlebar" style="height:65px">
			<div class="topbar whitebar" style="height:65px">
				<div class="back"  tapmode="" onclick="goback()"  style="margin-top:20px"><img src="../image/ic_back_u.png" alt=""></div>
				<div class="title" id="title"  style="margin-top:20px">在线分析结果</div>
			</div>
		</div>
	</div>

	<div id="answerBox" >
	    <div>在线爬取中...请稍等片刻</div>
	</div>
  <div class="h20"></div>
	<div id="urlBox">
		<!-- <ul id="list" class="innerBox">
				<li style=""   tapmode="" onclick = "openDetail('fdj')">
					<div style="display:-webkit-box;-webkit-box-align: center;-webkit-box-pack: center;height:100%;width:60px;"><img height="25" width="25"	src="../image/my/tu1.png"></div>
					<div class="message-info" style="-webkit-box-flex:1;display:-webkit-box;-webkit-box-orient:vertical;line-height: 17px;" >
						<div style="-webkit-box-flex:1;">原因及解决方案 <span class="distance"><img height="17" width="20"	src="../image/hot.png">432</span></div>';
						<div  class="smallFont flex1"> 多久发货时间开发部fgb </div>
					</div>
				</li>

			 </ul> -->
	</div>

</div>


		<br/><br/>




</body>
<script type="text/javascript" src="../script/api.js"></script>
<script>

	apiready = function(){
		//获取上一页面传来的数据（包括机床品牌、型号、故障代码和故障描述）
		 brand = api.pageParam.brand;
		 xinghao = api.pageParam.xinghao;
		 errorid = api.pageParam.errorid;
		 describe = api.pageParam.describe;
			// alert('brand-' + brand + '\nxinghao-'+xinghao + '\nerrorid-' +errorid + '\ndescribe-'+describe)
			 question = ""; //全局变量
			 if (describe != "") {
	 		 question = "机床 " + describe;
	 	 }
			if (errorid != "") {
			 question = errorid +' '+ question;
		 }
			 if (xinghao != "") {
	 			question = xinghao +' '+ question;
	 		}
			if (brand != "其他品牌" && brand != "请选择品牌") {
				question = brand +' '+ question;
			}
			// alert("out+"+question);

			// var text=document.querySelector('#answerBox').innerText;
			//     setInterval(function () {
			//         if (navigator.onLine) {
			//         } else {
			//             //alert('offline：断开网络');
			//             document.querySelector('#answerBox').style.color='blue';
			//             document.querySelector('#answerBox').innerText = '请检查您的网络连接'
			//         }
			//     },10000);



			// 访问服务器端数据
				api.ajax({
	    		url: 'http://120.77.37.120:8000/pa?question=' + question, // 请求数据库的接口     http://120.77.37.120:8000/pa?question=数控机床主轴温度过高
	    		method: 'get',
	    		headers:{
	    			'Content-Type': 'application/json;charset=utf-8'
	    		}
	    	}, function(ret, err) {
					if (ret) { //ret是Object数据类型  想转换为String：res = $api.jsonToStr(ret);（）该方法可获得服务器端的完整返回数据
						// alert($api.jsonToStr(ret));
						res = eval(ret); //从服务器返回来的json数据    JSON.stringify(ret)
	           answerList = res.answer; //返回的answer
						 urlList = res.simple_url; //返回的simple_url
						//  alert(answerList.length + answerList);
						 sumZan = 0;
						 for(var i=0;i<answerList.length;i++){
							 sumZan += parseFloat(answerList[i].zan);
						 }


						if(answerList.length == 0){  //当搜索“西门子”品牌，"主轴温度过高"描述时，返回来的json里，是"answer": []   该情况用length=0处理
							// alert('answer.length为0');
							var resultShow = document.getElementById('answerBox');
							resultShow.innerHTML = '<div>未搜索到您的问题！来看看相似问题吧！</div>';
						}else{

							//返回的answer展示
		          if(answerList[0].answer != '未搜索到您的问题！来看看相似问题吧！'){ //返回的answer里有解决方案

								var html = '<ul id="list" class="innerBox">';
		             for(var i=0;i<answerList.length;i++)
		             {
		               var listStrShow = answerList[i].answer.substr(0,40); //由于列表显示空间有限，解决方案内容较长，这里只截取前一部分
		                    var cl = '<li style=""   tapmode="" onclick = "openDetail(\'' + answerList[i].answer + '\')">' +
												'<div style="display:-webkit-box;-webkit-box-align: center;-webkit-box-pack: center;height:100%;width:60px;"><img height="25" width="25"	src="../image/my/tu1.png"></div>' +
												'<div class="message-info" style="-webkit-box-flex:1;display:-webkit-box;-webkit-box-orient:vertical;line-height: 17px;" >' +
												'<div style="-webkit-box-flex:1;">原因及解决方案 <span class="distance"><img height="17" width="20"	src="../image/hot.png">' + (answerList[i].zan/sumZan*100).toFixed(2) + '%</span></div>';
		                html += cl+ '<div  class="smallFont flex1">' + listStrShow + '</div> </div></li>';

		             }
								 html += '</ul>';

		            answerShow = document.getElementById('answerBox');
		            answerShow.innerHTML = html;

		          }else{ //返回的answer里面没有解决方案
		            var resultShow = document.getElementById('answerBox');
		            resultShow.innerHTML = '<div>未搜索到您的问题！来看看相似问题吧！</div>';
		          }

					}



						//相关链接展示
						if(urlList.length > 0){ //返回的simple_url不为空
								var htmlUrl = '<ul id="list" class="innerBox">';
			             for(var i=0;i<urlList.length;i++)
			             {
			               var title = urlList[i].title;
										 var url = urlList[i].sub_url;
			              //  alert(title + '\n' + url);
	                  var cl = '<li style=""   tapmode="" onclick="openWin(\'' + url+ '\')" >' +
										'<div style="display:-webkit-box;-webkit-box-align: center;-webkit-box-pack: center;height:100%;width:60px;"><img height="30" width="30"	src="../image/my/tu2.png"></div>' +
										'<div class="message-info" style="-webkit-box-flex:1;display:-webkit-box;-webkit-box-orient:vertical;line-height: 17px;" >' +
										'<div style="-webkit-box-flex:1;">' + title + '</div> </div></li>';
			                htmlUrl += cl;
											// alert(htmlUrl);
			             }
									 htmlUrl += '</ul>';

			            urlShow = document.getElementById('urlBox');
			            urlShow.innerHTML = '<div>相关链接</div> ' + htmlUrl;
						}else{//返回的simple_url为空
							urlShow = document.getElementById('urlBox');
							urlShow.innerHTML = '<div>未检索到相关链接</div>';
						}


		            } else {
	                var resultShow = document.getElementById('answerBox');
	                resultShow.innerHTML = '<div>未搜索到您的问题</div>';
		            	api.toast({
		            		msg: '未检索到解决方案',
		            		duration: 2000,
		            		location: 'bottom'
		            	});
		            }

		        	// 隐藏加载状态对话框
		        	api.hideProgress();
          });


		};


    function goback () {
      api.closeWin({name:'spiderOnline_result'});
    }

		function openDetail(answer1){
			// alert(answer1);
			// alert('result页\nquestion-'+question+'\nanswer-'+answer1+'\nbrand-'+brand+'\nxinghao-'+xinghao+'\nerrorid-'+errorid+'\ndescribe-'+describe);

			api.openWin({
          name: 'answerOnline_detail',
          url: './answerOnline_detail.html',
          pageParam: {
            question:question,
						answer: answer1,
						brand: brand,
            xinghao: xinghao,
            errorid: errorid,
            describe:describe,
         }
      });
		}

		function openWin(url) {
					//alert(url);
          api.openWin({
                  name : 'win_show2',
                  url : url,
                  rect : {
                          x : 0,
                          y : 0,
                  }
          })
  }





</script>
</html>
